<!--
 * @Author: ReinerLau lk850593913@gmail.com
 * @Date: 2022-09-13 17:16:47
 * @LastEditors: ReinerLau lk850593913@gmail.com
 * @LastEditTime: 2022-09-26 13:00:50
 * @FilePath: \robot\src\views\patroling\PatrolingList.vue
 * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
-->
<template>
  <div class="bg-[#072232]">
    <div
      v-for="item in list"
      :key="item.id"
      class="bg-[#0C2D46] px-7 py-3 mb-3 border border-solid border-[#1c91c7]"
    >
      <div class="flex mb-7">
        <div
          v-for="col in columns"
          :key="col.prop"
          class="flex-1 text-[#7b969e]"
        >
          {{ col.title || "" }}
        </div>
      </div>
      <div class="flex">
        <div
          v-for="col in columns"
          :key="col.prop"
          class="flex-1 flex items-center"
        >
          <slot v-if="col.formatter" :name="col.prop" :row="item"></slot>
          <span v-else class="text-white">
            {{ item[col.prop] }}
          </span>
        </div>
      </div>
    </div>
  </div>
</template>
<script setup>
defineProps({
  list: {
    type: Array,
    default: () => [],
  },
  columns: {
    type: Array,
    default: () => [],
  },
});
</script>
